﻿<style>
    .btn-scrolltop.bui-btn {
    position:absolute;
    bottom: 1.2rem;
    right:.15rem;
    z-index: 10;
    -webkit-border-radius: .1rem;
    border-radius: .1rem;
    width: .8rem;
    height: .8rem;
    line-height: .8rem;
    padding-top: 0;
    padding-bottom: 0;
}
</style>
<div class="bui-page">
	<header class="bui-bar">
		<div class="bui-bar-left">
			<a class="bui-btn" onclick="bui.back();"><i class="icon-back"></i></a>
		</div>
		<div class="bui-bar-main">
			TAB选项卡-嵌套
		</div>
		<div class="bui-bar-right">
		</div>
	</header>
	<main>
		<div id="tabFoot" class="bui-tab">
			<div class="bui-tab-main">
				<ul>
					<li>
                        <div id="uiSlideTabChild" class="bui-tab">
                            <div class="bui-tab-head">
                                <ul class="bui-nav">
                                    <!-- 分屏菜单 active 是激活的TAB样式 -->
                                    <li class="bui-btn active">最新</li>
                                    <li class="bui-btn">最热</li>
                                </ul>
                            </div>
                            <div class="bui-tab-main">
                                <ul>
                                    <li id="scrollMain">
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                        最新内容<br>
                                    </li>
                                    <li>
                                        最热内容
                                    </li>
                                </ul>
                            </div>
                        </div>
					</li>
					<li>
						新闻tab
					</li>
					<li>
						图片tab
					</li>
					<li>
						设置tab
					</li>
				</ul>
		
			</div>
		</div>
		
	</main>
    <div class="bui-btn round btn-scrolltop"><i class="icon-listup"></i></div>
	<footer>
		<ul id="tabFootNav" class="bui-nav">
			<li class="bui-btn bui-box-vertical active"><i class="icon-home"><span class="bui-badges">5</span></i><div class="span1">首页</div></li>
			<li class="bui-btn bui-box-vertical"><i class="icon-share"></i><div class="span1">新闻</div></li>
			<li class="bui-btn bui-box-vertical"><i class="icon-pic"><span class="bui-badges"></span></i><div class="span1">图片</div></li>
			<li class="bui-btn bui-box-vertical"><i class="icon-setting"></i><div class="span1">设置</div></li>
		</ul>
	</footer>
</div>
